import React, { Component } from 'react';
import {
	StyleSheet, Text, View, PixelRatio, TouchableOpacity
} from "react-native";
import { GLOBAL } from '../../../../config/global';
import { style } from '../../../../theme/style';
const scale = GLOBAL.SCALE;
export class OyNotItem extends Component {
	constructor(props) {
		super(props)
	}

	render () {
		let { data, choice } = this.props;
		let { occupyItemList, totalAmount } = data;
		return (
			<View style={styles.listOuter}>
				<View>
					<View style={styles.listBox}>
						<View style={styles.itemHead}>
							<Text style={styles.itemTitle}>{occupyItemList && occupyItemList[0].companyName}</Text>
							<Text style={{ fontSize: 10 * scale, paddingLeft: 12 * scale, color: '#848A96' }}>(业务组织：{choice.corpName || '-'})</Text>
						</View>
						<View style={styles.itemList}>

							{
								occupyItemList && occupyItemList.map((item, index) => {
									return (
										<View style={[styles.itemHeight, occupyItemList.length - 1 > index ? styles.itemHeightLine : null]} key={index}>
											<View style={styles.flexRow}>
												<Text style={styles.itemText}>{item.orderId}</Text>
												{
													item.orderType == 'P' ? (
														<Text style={styles.buyText}>采</Text>
													) : (
															<Text style={styles.sellText}>销</Text>
														)
												}
											</View>
											<Text style={styles.money}>￥{item.notCheckAmount || '-'}</Text>
										</View>
									)
								})
							}
						</View>
						{/* <View style={styles.felxName}>
							<Text style={styles.totalKey}>业务员
							</Text>
							<Text style={[styles.totalKey, { marginLeft: 10 * scale, paddingRight: 40 * scale, marginTop: -1 * scale }]}>
								张三 | 乙醇甲兵组（一部）| 华东分公司华东分公司华东分公司华东分公司
				     </Text>
						</View> */}
						<View style={styles.total}>
							<Text style={styles.totalKey}>合计 <Text style={styles.totalValue}>¥{totalAmount || '-'}</Text></Text>
						</View>
					</View>
				</View>
			</View>
		)
	}
}
const styles = StyleSheet.create({
	listOuter: { flexDirection: 'row', justifyContent: 'center' },
	flexRow: {
		flexDirection: 'row',
		alignItems: 'center',
	},
	listBox: {
		width: 351 * scale,
		backgroundColor: style.color.white,
		borderRadius: 6 * scale,
		marginBottom: 18 * scale,
	},
	itemHead: {
		height: 58 * scale,
		borderBottomWidth: 1 / PixelRatio.get(),
		borderStyle: 'solid',
		borderBottomColor: style.color.gray,
	},
	itemTitle: {
		fontSize: 13 * scale,
		paddingLeft: 12 * scale,
		paddingRight: 12 * scale,
		color: style.color.atrous,
		lineHeight: 35 * scale
	},
	itemList: {
		marginLeft: 10 * scale,
		marginRight: 10 * scale,
		borderBottomWidth: 1 / PixelRatio.get(),
		borderStyle: 'solid',
		borderBottomColor: style.color.gray,
		paddingTop: 2 * scale,
		paddingBottom: 2 * scale,
	},
	itemHeight: {
		flexDirection: 'row',
		justifyContent: 'space-between',
		paddingTop: 6 * scale,
		paddingBottom: 6 * scale,
	},
	itemHeightLine: {
		borderBottomWidth: 1 / PixelRatio.get(),
		borderStyle: 'solid',
		borderBottomColor: style.color.gray,
	},
	money: {
		fontSize: 14 * scale,
		color: style.color.atrous,
		fontWeight: 'bold'
	},
	itemText: {
		color: style.color.atrous,
		fontSize: 13 * scale,
	},
	sellText: {
		color: '#F5A623',
		fontSize: 14 * scale,
		fontWeight: 'bold',
		paddingLeft: 10 * scale,
	},
	buyText: {
		color: '#82CD4B',
		fontSize: 14 * scale,
		fontWeight: 'bold',
		paddingLeft: 10 * scale
	},
	total: {
		flexDirection: 'row',
		justifyContent: 'flex-end',
		alignItems: 'center',
		paddingRight: 10 * scale,
		height: 35 * scale
	},
	totalValue: {
		fontSize: 16 * scale,
		fontWeight: 'bold',
	},
	totalKey: {
		fontSize: 12 * scale,
		color: style.color.atrous
	},
	felxName: {
		flexDirection: 'row',
		justifyContent: 'flex-start',
		// alignItems: 'center',
		marginLeft: 10 * scale,
		marginTop: 10 * scale,
		marginRight: 5 * scale,
	},
})